<template>
    <lay-layer v-model="Window_show" :btn="Window_btn" :title="layer_title" :area="['600px', 'auto']"
        :shadeClose="shadeClose" :maxmin="true" :moveOut="true" :resize="true" closeBtn="1" :end="end" :close="close"
        :beforeClose="beforeClose">
        <lay-form :model="modelForm" ref="layFormRef" required>
            <lay-tab type="card" v-model="tab_id">
                <lay-tab-item title="基础信息" id="1">
                    <div style="padding:0px 10px 0px 10px;">
                        <lay-form-item label="名称">
                            <lay-input v-model="modelForm.name" placeholder="请输入名称"></lay-input>
                        </lay-form-item>
                        <lay-form-item label="状态" prop="state">
                            <lay-radio v-model="modelForm.state" name="state" value="A">正常</lay-radio>
                            <lay-radio v-model="modelForm.state" name="state" value="B">停用</lay-radio>
                        </lay-form-item>
                    </div>
                </lay-tab-item>
                <lay-tab-item title="附加信息" id="4">
                    <div style="padding:0px 10px 0px 10px;">
                        <lay-form-item label="备注">
                            <lay-textarea placeholder="请输入描述" v-model="modelForm.memo"></lay-textarea>
                        </lay-form-item>
                    </div>
                </lay-tab-item>
            </lay-tab>
        </lay-form>
    </lay-layer>
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue';
import { layer } from '@layui/layui-vue';
import { HTTPGroupBranchDepartmentsNew, HTTPGroupBranchDepartmentsUp } from "../../../../api/module/user"; //请求模块

const emit = defineEmits(['topClick']);
const layer_title = ref('新增');//弹窗标题
const shadeClose = ref(true);//遮盖层关闭
const http_r_p = ref('up');//新增还是修改
const Window_show = ref(false);// 弹窗显示
const layFormRef = ref();
/** 选项卡默认激活ID */
const tab_id = ref("1")
/** 表单按钮 */
const Window_btn = ref([
    {
        text: "提交",
        callback: () => {
            submit();
        },
    },
    {
        text: "离开",
        callback: () => {
            Window_show.value = !Window_show.value; //弹窗显示
        },
    },
]);
// 表单字段
const modelForm = ref({
    "id": 0,
    "state": "A",// 状态_A正常B停用
    "name": "",//名称
    'dbid': "", //数据编号.唯一
    'memo': "", //备注
});

const form = reactive({});//缓存旧数据为还原表单做准备

const childFun = (op: string, data: any) => {
    // op='up'//修改模式
    // op='new'//新增模式
    Window_show.value = !Window_show.value;
    if (op == 'up') {
        http_r_p.value = 'up';//新增还是修改
        layer_title.value = '修改';//弹窗标题
        shadeClose.value = true;//遮盖层关闭
        modelForm.value = data;//把上级行数据填到窗口中
        Object.assign(form, { ...data });
    } else {
        http_r_p.value = 'new';//新增还是修改
        layer_title.value = '新增';//弹窗标题
        shadeClose.value = false;//遮盖层关闭
        modelForm.value = {
            "id": 0,
            "state": "A",// 状态_A正常B停用
            "name": "",//名称
            'dbid': "", //数据编号.唯一
            'memo': "", //备注
        }
    }
};
// 原始数据
const original = () => { Object.assign(modelForm.value, { ...form }); };
// 清空表单
const reset = () => { layFormRef.value.reset(); };
// 清除校验
const clearValidate = () => { layFormRef.value.clearValidate(); };
// 窗口销毁
const end = () => { };
// 窗口关闭
const close = () => { };
// 窗口关闭前置
const beforeClose = () => { original(); };
// 提交表单
const submit = function () {
    layFormRef.value.validate((isValidate: any, model: any, errors: any) => {
        if (isValidate) {
            http_r('new', model);
        } else {
        }
    });
}
// HTTP请求
const http_r = async (op: string, UDB: any) => {
    console.log("HTTP请求数据", UDB);
    //新增还是修改
    if (http_r_p.value == 'up') {
        let res = await HTTPGroupBranchDepartmentsUp(UDB);//HTTP
        console.log("修改-HTTP回调", res);

        if (res.code == 200) {
            layer.msg(res.msg, { icon: 1 }, async () => {
                emit('topClick', '父组件事件');
                Window_show.value = !Window_show.value;
            });
        } else {
            layer.msg(res.msg, { icon: 2 });
        }
    } else if (http_r_p.value == 'new') {
        let res = await HTTPGroupBranchDepartmentsNew(UDB);
        console.log("新增-HTTP回调", res);
        if (res.code == 200) {
            layer.msg(res.msg, { icon: 1 }, async () => {
                emit('topClick', '父组件事件');
                Window_show.value = !Window_show.value;
            });
        } else {
            layer.msg(res.msg, { icon: 2 });
        }
    } else { }

};


//向父组件暴露子组件的方法或者数据
defineExpose({ childFun, });
</script>